<template>
	<div class="view">
		<Menu mode="vertical" 
			theme="dark" 
			ref="menu"
			:accordion="true" 
			:active-name="active" 
			:open-names="opens"
			@on-select="select2Menu"
			@on-open-change="select2Open">
			<div v-for="(item, index) in menus">
				<Menu-group :title="item.title" 
					v-if="item.type == 'group'">
				</Menu-group>
				<router-link 
						:to="item.path"
						:key="index"
						v-if="item.type == 'menu' && hasFun(item.name)">
						
					<Menu-item :name="item.name">
						<Icon :type="item.icon"></Icon>
						{{item.label}}
					</Menu-item>
				</router-link>
				
				<Submenu 
					:name="item.name"
					v-if="item.type == 'sub' && hasFun(item.name)"
					:key="index">
					<template slot="title">
                        <Icon :type="item.icon"></Icon>
                        {{item.label}}
                    </template>
                 
					<router-link 
						:to="{path: mitem.path, query: mitem.query}"
						:key="mindex"
						v-for="(mitem, mindex) in item.items"
						v-if="hasFun(mitem.name)">
						<Menu-item :name="mitem.name">
							<Icon :type="mitem.icon"></Icon>
							{{mitem.label}}
						</Menu-item>
					</router-link>
					
				</Submenu>
			</div>
		</Menu>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				menus: $menus,
				opens: [],
				active: '',
				funs: []
			}
		},
		created() {
			var $this = this;
			
			var account = $this.$store.getters.account;
			if(account != null) {
				if(account.funs != null) {
					this.funs = account.funs;
				}
			}
			var menu = $this.$store.getters.menu;
			if(menu != null) {
				$this.active = menu.active;
				$this.opens = menu.opens;
			}
		},
		methods: {
			hasFun(name) {
				for(var i=0; i< this.funs.length; i++) {
					var item = this.funs[i];
					if(item == name) {
						return true;
					}
				}
				return false;
			},
			select2Menu(active) {
				var $this = this;
				this.active = active;
				this.$store.commit('setMenu', {
					active: active,
					opens: $this.opens
				});
			},
			select2Open(opens) {
				var $this = this;
				this.opens = opens;
				this.$store.commit('setMenu', {
					active: $this.active,
					opens: $this.opens
				});
			}
		}
	}
	
	const $menus = [
		{
			type: 'menu',
			name: 'home',
			label: '首页',
			icon: 'ios-home',
			path: '/main/home'
		}, {
			type: 'sub',
			name: 'user-menus',
			label: '影人管理',
			icon: 'ios-people',
			items: [
				{
					path: '/main/userList',
					name: 'user/list',
					label: '注册影人'
				},
				{
					path: '/main/userInviteList',
					name: 'user/invite',
					label: '邀请信息'
				}
			]
		}, {
			type: 'sub',
			name: 'user-tag-menus',
			label: '影人职业',
			icon: 'pricetags',
			items: [
				{
					path: '/main/atagGroup',
					name: 'user/atags/group',
					label: '职业分组'
				},
				{
					path: '/main/atags',
					name: 'user/atags',
					label: '职业属性'
				}
			]
		}, {
			type: 'sub',
			name: 'user-attr-menus',
			label: '影人属性',
			icon: 'bowtie',
			items: [
				{
					path: '/main/userLabel',
					query: {
						type: 1
					},
					name: 'user/label/worksYear',
					label: '入行时间筛选'
				},
				{
					path: '/main/userLabel',
					query: {
						type: 2
					},
					name: 'user/label/passport',
					label: '护照筛选'
				},
				{
					path: '/main/userLabel',
					query: {
						type: 3
					},
					name: 'user/label/age',
					label: '年龄筛选'
				},
				{
					path: '/main/userLabel',
					query: {
						type: 4
					},
					name: 'user/label/gender',
					label: '性别筛选'
				},
				{
					path: '/main/language',
					name: 'user/language',
					label: '外语能力',
					type: [1, 2]
				},
				{
					path: '/main/nation',
					name: 'user/nation',
					label: '民族信息'
				}
//				,
//				{
//					path: '/main/userList',
//					name: 'user/country',
//					label: '国家信息',
//					type: [1, 2]
//				},
//				{
//					path: '/main/userList',
//					name: 'user/province',
//					label: '省份信息',
//					type: [1, 2]
//				},
//				{
//					path: '/main/userList',
//					name: 'user/ckty',
//					label: '城市信息',
//					type: [1, 2]
//				}
			]
		}, {
			type: 'sub',
			name: 'works-menus',
			label: '作品管理',
			icon: 'film-marker',
			items: [
				{
					path: '/main/worksEdit',
					name: 'works/worksEdit',
					label: '新建作品'
				},
				{
					path: '/main/worksList',
					name: 'works/worksList',
					label: '入库作品'
				},
				{
					path: '/main/works2Status',
					name: 'works/works2Status',
					label: '我管理的作品'
				},
				{
					path: '/main/works2Wait',
					name: 'works/works2Wait',
					label: '待审核作品'
				}
			]
		}, {
			type: 'sub',
			name: 'works-attr-menus',
			label: '作品属性',
			icon: 'videocamera',
			items: [
				{
					path: '/main/worksAttr',
					name: 'works/attr',
					label: '作品属性'
				},
				{
					path: '/main/worksType',
					name: 'works/type',
					label: '作品类型'
				},
				{
					path: '/main/worksArea',
					name: 'works/area',
					label: '发行地区',
				},
				{
					path: '/main/worksLabel',
					query: {
						type: 1
					},
					name: 'works/label/releaseDate',
					label: '上映时间'
				},
				{
					path: '/main/worksLabel',
					query: {
						type: 2
					},
					name: 'works/label/duration',
					label: '作品片长'
				},
				{
					path: '/main/worksLabel',
					query: {
						type: 3
					},
					name: 'works/label/episodes',
					label: '作品集数'
				},
				{
					path: '/main/worksLabel',
					query: {
						type: 4
					},
					name: 'works/label/boxOffice',
					label: '作品票房'
				}
			]
		}, {
			type: 'sub',
			name: 'notice-menus',
			label: '公告管理',
			icon: 'speakerphone',
			items: [
				{
					path: '/main/noticeEdit',
					name: 'notice/edit',
					label: '公告编辑'
				},
				{
					path: '/main/noticeList',
					name: 'notice/list',
					label: '公告列表'
				}
			]
		}, {
			type: 'sub',
			name: 'ad-menus',
			label: '广告管理',
			icon: 'android-mail',
			items: [
				{
					path: '/main/adEdit',
					name: 'ad/adEdit',
					label: '广告编辑'
				},
				{
					path: '/main/adList',
					name: 'ad/list',
					label: '广告列表'
				}
			]
		}, {
			type: 'sub',
			name: 'account-menus',
			label: '运营管理',
			icon: 'person',
			items: [
				{
					path: '/main/accountList',
					name: 'account/list',
					label: '运营人员'
				}
			]
		}
	]
</script>

<style>

</style>